/*
 * @Description:
 * @Author: Zzt
 * @Date: 2022-08-17 19:25:50
 * @LastEditTime: 2022-08-18 11:17:25
 */
import { Button, Form, Input, Modal, Progress, Table } from 'antd';
import Column from 'antd/es/table/Column';
import { useEffect } from 'react';
const OfflineDetails = (props: any) => {
  const { visible, onClose, data } = props;
  useEffect(() => {
    form.setFieldsValue(data);
  }, [visible]);
  const handleOk = () => {
    onClose();
  };
  const handleCancel = () => {
    onClose();
  };

  const [form] = Form.useForm();
  const submitFunc = () => {
    form.submit();
    onClose();
  };

  return (
    <>
      <Modal
        visible={visible}
        title="离线备份详情"
        onOk={handleOk}
        onCancel={handleCancel}
        width={700}
        footer={[
          <Button key="close" onClick={onClose}>
            取消
          </Button>,
          // <Button key="createAdd" type="primary">创建并添加档案</Button>,
          <Button
            key="yes"
            type="primary"
            onClick={() => {
              submitFunc();
            }}
          >
            完成
          </Button>
        ]}
      >
        <Form form={form} size="small" labelCol={{ span: 5 }} wrapperCol={{ span: 17 }}>
          <Form.Item label="所属备份计划" name="belongs">
            <Input bordered={false} disabled={true}></Input>
          </Form.Item>
          <Form.Item label="档案类型" name="type">
            <Input bordered={false} disabled={true}></Input>
          </Form.Item>
          <Form.Item label="档案范围" name="range">
            <Input bordered={false} disabled={true}></Input>
          </Form.Item>
          <Form.Item label="备份时间节点" name="finishTime">
            <Input bordered={false} disabled={true}></Input>
          </Form.Item>
          <Form.Item label="离线文件名称" name="name">
            <Input bordered={false} disabled={true}></Input>
          </Form.Item>
          <Form.Item label="离线文件生成时间" name="generateTime">
            <Input bordered={false} disabled={true}></Input>
          </Form.Item>
          <Form.Item label="单张介质容量" name="capacity">
            <Input bordered={false} disabled={true}></Input>
          </Form.Item>
          <Form.Item label="备份文件">
            <Input bordered={false} disabled={true}></Input>
            <Table>
              <Column title="序号" dataIndex="id" key="id" align="center" />
              <Column title="文件名" dataIndex="name" key="name" align="center" />
              <Column title="操作" dataIndex="active" key="active" align="center" />
            </Table>
          </Form.Item>
          <Form.Item label="操作人" name="backupBy">
            <Input bordered={false} disabled={true}></Input>
          </Form.Item>
          <Form.Item label="状态" name="state">
            <Input bordered={false} disabled={true}></Input>
            <Progress percent={50} strokeLinecap="butt" />
          </Form.Item>
          <Form.Item label="离线备份地点" name="site">
            <Input bordered={false} disabled={true}></Input>
          </Form.Item>
          <Form.Item label="备注" name="remark">
            <Input bordered={false} disabled={true}></Input>
          </Form.Item>
        </Form>
      </Modal>
    </>
  );
};
export default OfflineDetails;
